import React from "react";
import {Button, Breadcrumb, Menu} from 'antd/lib';

import TimeSerialDialog from "@/components/timeserial/TimeSerialDialog";
import navigateTo from "@/components/ApplicationArea/navigateTo";
import TimeSerialCard from "@/components/TimeSerialCard";

import timestruct from "@/services/timestruct";
import AppleOutlined from "@ant-design/icons/AppleOutlined";

export default class TimeSerialBread extends React.Component {

  state = {
    timestruct_nodes:  [],
    loading: true,
    item:{},
    data:[],
      // {
      //   id: "0",
      //   num: "",
      //   name: "自然日历",
      //   parent_id:"0",
      //   nodes:[]
      // },],
  };
  componentWillMount() {
    //let  fname= this.props.item;
      this.setState( {
         timestruct_nodes :[
          {
            id:  "0",
            num: "",
            ischeck: true,
            calendar_enum: this.props.item.calendar_enum,
            name: this.props.item.name,
            timestruct_id: this.props.item.id,
            nodes:[]
          }],//20200311q从父窗口取数
          loading: false,
          item:{},
          data:[],
      });
  }
  // 这种方式十分适合父子组件的互动，通常是父组件需要通过某些状态控制子组件渲染亦或销毁...
componentWillReceiveProps(nextProps) {//componentWillReceiveProps方法中第一个参数代表即将传入的新的Props
  if (this.props.item.id !== nextProps.item.id){
      this.setState( {
        timestruct_nodes :[
        {
          id:  "0",
          num: "",
          ischeck: true,
          calendar_enum: this.props.item.calendar_enum,
          name: nextProps.item.name,
          timestruct_id: nextProps.item.id,
          nodes:[]
        }],//20200311q从父窗口取数
        loading: false,
        item:{},
        data:[],
    });
  }
}
showNodeDialog = () => {
    let nodetemp =this.state.timestruct_nodes;
    let date = new Date();
    let item = {   id: 0,
        num: "",
        name: "",
        calendar_enum: nodetemp[0].calendar_enum,
        timestruct_id: nodetemp[0].timestruct_id,
        parent_id: 0,
        begin_date: date,
        close_date: date
      };
    while (nodetemp.length>0) {
       let selectnode=nodetemp.find(node => node.ischeck);
       if(selectnode.nodes.length>0)
       {
         item.parent_id=selectnode.id;
       }
       item.calendar_enum=selectnode.calendar_enum;
       item.timestruct_id=selectnode.timestruct_id;
       nodetemp =selectnode.nodes;
    }
  TimeSerialDialog.showModal({timeserial_item: item})
    .onClose((result = {}) => {
      if (result.success) {
        this.setState( {
          loading: false,
          item:{},
          data:[],
        });
      }
    })
    .onDismiss(() => {
      navigateTo("timeserial", true);
    });
};
 breadpre= (node,id) => {
    let tempnode=[];
    let selectnode=node.find(item => item.timestruct_id===id);
    if(selectnode ==null)
    {
      node.map(da=> {
        let daone=da;
      if(daone.ischeck)
      {
          if (daone.nodes.length>0)
          {
             daone.nodes =this.breadpre(da.nodes,id);
          }
        }
      tempnode.push(daone);
      return tempnode;
    });
  }
  else{
        node.map(da=> {
            let daone=da;
          if(daone.timestruct_id===id)
          {
            daone.ischeck =true;
          }
          else{
            daone.ischeck =false;
          }
           daone.nodes =[];
           daone.id='0';
           daone.num='';
           tempnode.push(daone);
           return tempnode;
          });
  }
      return tempnode;
  }

  breadClick = id => {
    let nodes = this.breadpre(this.state.timestruct_nodes,id);
    this.setState( {
      timestruct_nodes: nodes,
      loading: false,
      item:{},
      data:[],
    });
  };
  ///刷新时间系列结构
  clickname = (item) => {
          //     id: 1,
      //     num: "1",
      //     calendar_enum: "nature",
      //     timestruct_id: "1",
      //     parent_id: "1",
      //     begin_date: "2020-1-1",
      //     close_date: "2020-1-31",
      //     timeserialstatus_enum: "Draft",
      timestruct.query(item.timestruct_id).then(data => {
        this.setState({
          loading: false,
          item: item,
          data: data,
    });
      });
  }
  clickcrumbs= (node) => {
    this.setState({
      loading: true,
});
    let tempnode=[];
    node.map(da=> {
        let daone=da;
      if(daone.ischeck)
      {
          if (daone.nodes.length>0)
          {
             daone.nodes =this.clickcrumbs(da.nodes);
          }
          else{
              ///查询时间序列结构item.timestruct_id
              let  nodes=[];
                  let datatemp=this.state.data;
                  datatemp.map(das => {
                   return (nodes.push({id:  '0',
                    num: '',
                    ischeck: false,
                    calendar_enum: das.calendar_enum,
                    name: das.name,
                    timestruct_id: das.id,
                    nodes:[]
                }))});
                if(nodes.length>0)
                {
                  nodes[0].ischeck = true;
                  daone.nodes=nodes;
                  daone.id=this.state.item.id;
                  daone.num=this.state.item.num;
                }
          }
        }
      tempnode.push(daone);
      return tempnode;
    });
      return tempnode;
  }

  loop = (nodes) => {
    let returnInfo = [];

   let itemnodes =nodes;

  //  returnInfo.push(this.state.timestruct_nodes.map(node => {
      if (itemnodes.length > 1) {
          let selectinode=itemnodes.find(tempnode => tempnode.ischeck);
        let menu = (
          <Menu selectedKeys={selectinode.timestruct_id}>
            {itemnodes.map(tempnode => { return (
              <Menu.Item key={tempnode.timestruct_id} onClick={()=>this.breadClick(tempnode.timestruct_id)}>
                <a className="clickable">   {tempnode.name+tempnode.num}</a>
              </Menu.Item>
            )})};
          </Menu>
        );
        returnInfo.push( <Breadcrumb.Item overlay={menu} />);
        if(selectinode.nodes.length>0)
        {
          returnInfo.push.apply(returnInfo, this.loop(selectinode.nodes));
        }
         //  return <Breadcrumb.Item overlay={menu} />
      } else {
        let tempnode = itemnodes[0];
        returnInfo.push(
          <Breadcrumb.Item key={tempnode.timestruct_id}  onClick={()=>this.breadClick(tempnode.timestruct_id)} >
            <AppleOutlined />
            <a className="clickable">
              {tempnode.name+tempnode.num}
            </a>
          </Breadcrumb.Item> );
          if(tempnode.nodes.length>0)
          {
             returnInfo.push.apply(returnInfo, this.loop(tempnode.nodes));
          }
      };

      return returnInfo;
  };

  renderBread() {
    return (
      <div className="m-b-15">
        <div className="wrapbread">
           <div>
            <Breadcrumb separator-class="el-icon-arrow-right">
              {this.loop(this.state.timestruct_nodes)}
            </Breadcrumb>
          </div>
          <div>
            <Button type="primary" onClick={() => this.showNodeDialog()}>
              <i className="fa fa-plus m-r-5" />
              新建
            </Button>
          </div>
        </div>
      </div>
    );
  };

  render() {
    if(this.state.data.length>0)
    {
          let  tnodetemp= this.clickcrumbs(this.state.timestruct_nodes)
        this.setState( {
          timestruct_nodes : tnodetemp,
          item: {},
          data: [],
          //  {
          //    id:  item.id,
          //    num:  item.num,
          //    ischeck: true,
          //    name: this.props.item.name,
          //    timestruct_id: timestruct_id,
          //    nodes:[]
          //  }],//20200311q从父窗口取数
          loading: false,
      });
    }
    if (this.state.loading) return null;
   // let node = this.state.timestruct_nodes[0];
   // let  fname= this.props.item;
    let nodes = this.state.timestruct_nodes;
    let timestruct_id='0';
    let id='0';
    while (nodes.length>0) {
      let selectnode=nodes.find(node => node.ischeck);
      if(selectnode.nodes.length>0)
      {
          id=selectnode.id;
      }
      timestruct_id=selectnode.timestruct_id;
      nodes =selectnode.nodes;
   }
      return (
        <React.Fragment>
          {this.renderBread()}
            <TimeSerialCard parent_id={id} timestruct_id={timestruct_id} clickname={this.clickname} />
        </React.Fragment>
      );
  }
}
